import type { CSSProperties, PropType } from 'vue';
import { FormSchema } from './types/form';
// 导入Element Plus组件库中Col和Button组件的属性类型定义
import type { ColProps } from 'element-plus/es/components/col/src/col';
import type { ButtonProps } from 'element-plus/es/components/button/src/button';

// 导入propTypes工具函数，用于简化prop类型定义
import { propTypes } from '@/utils/propTypes';
// 导入Element Plus的FormRules类型
import { FormRules } from 'element-plus';

export const basicProps = {
  /**
   * 表单数据对象
   */
  model: {
    type: Object,
  },
  /**
   * 表单验证规则
   */
  rules: {
    type: Object as PropType<FormRules>,
  },
  /**
   * 是否展示为行内表单
   */
  inline: {
    type: Boolean,
    default: false,
  },
  /**
   * 表单域标签的位置
   */
  labelPosition: {
    type: String,
    default: 'right',
  },
  /**
   * 标签宽度
   */
  labelWidth: {
    type: [Number, String] as PropType<number | string>,
    default: 80,
  },
  /**
   * 表单域标签的后缀
   */
  labelSuffix: {
    type: String,
  },
  /**
   * 是否显示必填字段的标签旁边的红色星号
   */
  hideRequiredAsterisk: {
    type: Boolean,
    default: false,
  },
  /**
   * 是否显示校验错误信息
   */
  showMessage: {
    type: Boolean,
    default: true,
  },
  /**
   * 是否以行内形式展示校验信息
   */
  inlineMessage: {
    type: Boolean,
    default: false,
  },
  /**
   * 是否在输入框中显示校验结果反馈图标
   */
  statusIcon: {
    type: Boolean,
    default: false,
  },
  /**
   * 是否在rules属性改变后立即触发一次验证
   */
  validateOnRuleChange: {
    type: Boolean,
    default: true,
  },
  /**
   * 大小
   */
  size: {
    type: String,
    default: 'default',
  },
  /**
   * 是否禁用该表单内的所有组件
   */
  disabled: {
    type: Boolean,
    default: false,
  },

  /*  =============================== 自定义开始 ================================= */

  /**
   * 表单配置规则
   */
  schemas: {
    type: [Array] as PropType<FormSchema[]>,
    default: () => [],
  },
  /**
   * 布局方式
   */
  layout: {
    type: String,
    default: 'vertical',
  },
  /**
   * 组件是否 100% 表单内所有组件适用
   */
  isFull: {
    type: Boolean,
    default: true,
  },
  /**
   * 是否显示操作按钮（查询/重置）
   */
  showActionButtonGroup: propTypes.bool.def(false),
  /**
   * 显示重置按钮
   */
  showResetButton: propTypes.bool.def(true),
  /**
   * 重置按钮配置
   */
  resetButtonOptions: Object as PropType<Partial<ButtonProps>>,
  /**
   * 显示确认按钮
   */
  showSubmitButton: propTypes.bool.def(true),
  /**
   * 确认按钮配置
   */
  submitButtonOptions: Object as PropType<Partial<ButtonProps>>,
  /**
   * 展开收起按钮
   */
  showAdvancedButton: propTypes.bool.def(true),
  /**
   * 确认按钮文字
   */
  submitButtonText: {
    type: String,
    default: '查询',
  },
  /**
   * 重置按钮文字
   */
  resetButtonText: {
    type: String,
    default: '重置',
  },
  /**
   * row配置
   */
  rowProps: Object as PropType<ColProps>,
  /**
   * col配置
   */
  colProps: Object as PropType<ColProps>,
  /**
   * grid样式
   */
  baseGridStyle: {
    type: Object as PropType<CSSProperties>,
  },
  /**
   * 是否折叠
   */
  collapsed: {
    type: Boolean,
    default: true,
  },
  /**
   * 默认展示的行数
   */
  collapsedRows: {
    type: Number,
    default: 1,
  },
};
